<template>
  <div class="app-container">
    <div class="listBox" v-loading="loading">
      <div class="listBox_head">
        <div class="title">激励规则配置</div>
        <el-button type="primary" @click="submitForm" :loading="sumitLoading">保存更新</el-button>
      </div>
      <div>
        <el-form ref="form" :model="form" :rules="rules" :disabled="disabled">
          <el-form-item label="邀新背景" prop="inviteUrl" ref="imgRef">
            <ImageUploadMore :limit="1" :fileSize="20" :fileType='fileType' @successImg="getImg"
              :value="form.inviteUrl">
            </ImageUploadMore>
          </el-form-item>
          <!-- 用户邀请新用户实名后可获赠奖品 -->
          <div class="detail_box">
            <el-form-item label="用户邀请新用户实名后可获赠奖品" prop="" label-width='230px'>
              <el-switch v-model="form.invitationConfigType" active-value="0" inactive-value="1">
              </el-switch>
            </el-form-item>
            <el-form-item label="邀请时间：" prop="dateTwo" ref="timeRef" :key="8" v-if="form.invitationConfigType=='0'">
              <el-date-picker v-model="form.dateTwo" type="datetimerange" value-format="yyyy-MM-dd HH"
                format="yyyy-MM-dd HH" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                :clearable="false" @input="$forceUpdate()" style="width: 300px">
              </el-date-picker>
            </el-form-item>
            <template v-if="form.invitationConfigType=='0'">
              <div class="flex">
                <div>
                  <el-button type="primary" size="small" @click="addInvitationRules" :disabled="(form.ruleType==2&&form.invitationConfigList2.length==1)?true:false">新增邀请规则</el-button>
                </div>
                <el-form-item label="规则类型：" prop="ruleType" :label-width="labelWidth">
                  <el-select filterable v-model="form.ruleType" placeholder="请选择" :style="{width: inputWidth}">
                    <el-option v-for="item in ruleTypeLs" :key="item.id" :label="item.value" :value="item.id" />
                  </el-select>
                </el-form-item>
              </div>
              <!-- <el-button type="primary" size="small" @click="addInvitationRules">新增邀请规则</el-button> -->
              <!-- 自定义邀新规则 -->
              <template v-if="form.ruleType=='1'">
                <div class="table_box" v-for="(item,index) in form.invitationConfigList" :key="index">
                  <div class="table_box_head">
                    <el-button type="danger" icon="el-icon-delete" circle @click="deleteInvitationRules(index)">
                    </el-button>
                  </div>
                  <el-form-item label="邀请人数：" :prop="'invitationConfigList.' + index + '.peoples'"
                    :rules="rules.peoples" :label-width="labelWidth">
                    <el-input v-model.number="item.peoples" placeholder="请填写邀请人数" :style="{width: inputWidth}">
                    </el-input>
                  </el-form-item>
                  <div v-for="(items,indexs) in item.prizeConfigList" :key="indexs">
                    <el-row type="flex" justify="start">
                      <el-col :span="6">
                        <el-form-item label="奖品类型："
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.prizeType'"
                          :rules="rules.prizeType" :label-width="labelWidth">
                          <el-select filterable v-model="items.prizeType" placeholder="请选择" clearable
                            :style="{width: inputWidth}" @change="selectChange">
                            <el-option v-for="item in prizeTypeLs" :key="item.id" :label="item.value"
                              :value="item.id" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <!-- 数字权益卡 -->
                      <el-col :span="6" v-if="items.prizeType==2">
                        <el-form-item label="选择数字权益卡：" ref="refOne"
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.equityCardId'"
                          :rules="rules.equityCardId" label-width="140px">
                          <el-select filterable v-model="items.equityCardId" placeholder="请选择" clearable
                            :style="{width: inputWidth}">
                            <el-option v-for="item in equityList" :key="item.id" :label="item.value" :value="item.id" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <!-- 盲盒优惠券 -->
                      <el-col :span="8" v-if="items.prizeType==1">
                        <el-form-item label="获赠盲盒优惠券数量：" ref="refTwo"
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.boxCouponNum'"
                          :rules="rules.boxCouponNum" label-width="180px">
                          <el-input v-model.number="items.boxCouponNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- 数字权益卡 -->
                      <el-col :span="7" v-if="items.prizeType==2">
                        <el-form-item label="获赠数量" ref="refThree"
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.equityCardNum'"
                          :rules="rules.equityCardNum" label-width="140px">
                          <el-input v-model.number="items.equityCardNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- CoCo -->
                      <el-col :span="7" v-if="items.prizeType==3">
                        <el-form-item label="CoCo获赠数量"
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.cocoNum'"
                          :rules="rules.cocoNum" label-width="140px">
                          <el-input v-model="items.cocoNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- 椰分 -->
                      <el-col :span="7" v-if="items.prizeType==4">
                        <el-form-item label="椰分获赠数量"
                          :prop="'invitationConfigList.'+index+'.prizeConfigList.'+indexs+'.tfNum'" :rules="rules.tfNum"
                          label-width="140px">
                          <el-input v-model="items.tfNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <div class="button_box">
                        <el-button type="primary" icon="el-icon-plus" circle size="mini" @click="addPrize(item)">
                        </el-button>
                        <el-button type="danger" icon="el-icon-delete" circle size="mini"
                          @click="deletePrize(item,indexs)" v-if="item.prizeConfigList.length>1"></el-button>
                      </div>
                    </el-row>
                  </div>
                </div>
              </template>
              <!-- 循环循环义邀新规则 -->
              <template v-if="form.ruleType=='2'">
                <div class="table_box" v-for="(item,index) in form.invitationConfigList2" :key="index">
                  <div class="table_box_head">
                    <el-button type="danger" icon="el-icon-delete" circle @click="deleteInvitationRules(index)">
                    </el-button>
                  </div>
                  <el-form-item label="邀请人数：" :prop="'invitationConfigList2.' + index + '.peoples'"
                    :rules="rules.peoples" :label-width="labelWidth">
                    <el-input v-model.number="item.peoples" placeholder="请填写邀请人数" :style="{width: inputWidth}">
                    </el-input>
                  </el-form-item>
                  <div v-for="(items,indexs) in item.prizeConfigList" :key="indexs">
                    <el-row type="flex" justify="start">
                      <el-col :span="6">
                        <el-form-item label="奖品类型："
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.prizeType'"
                          :rules="rules.prizeType" :label-width="labelWidth">
                          <el-select filterable v-model="items.prizeType" placeholder="请选择" clearable
                            :style="{width: inputWidth}" @change="selectChange">
                            <el-option v-for="item in prizeTypeLs" :key="item.id" :label="item.value"
                              :value="item.id" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <!-- 数字权益卡 -->
                      <el-col :span="6" v-if="items.prizeType==2">
                        <el-form-item label="选择数字权益卡：" ref="refOne"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.equityCardId'"
                          :rules="rules.equityCardId" label-width="140px">
                          <el-select filterable v-model="items.equityCardId" placeholder="请选择" clearable
                            :style="{width: inputWidth}">
                            <el-option v-for="item in equityList" :key="item.id" :label="item.value" :value="item.id" />
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <!-- 盲盒优惠券 -->
                      <el-col :span="8" v-if="items.prizeType==1">
                        <el-form-item label="获赠盲盒优惠券数量：" ref="refTwo"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.boxCouponNum'"
                          :rules="rules.boxCouponNum" label-width="180px">
                          <el-input v-model.number="items.boxCouponNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- 数字权益卡 -->
                      <el-col :span="7" v-if="items.prizeType==2">
                        <el-form-item label="获赠数量" ref="refThree"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.equityCardNum'"
                          :rules="rules.equityCardNum" label-width="140px">
                          <el-input v-model.number="items.equityCardNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- CoCo -->
                      <el-col :span="7" v-if="items.prizeType==3">
                        <el-form-item label="CoCo获赠数量"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.cocoNum'"
                          :rules="rules.cocoNum" label-width="140px">
                          <el-input v-model="items.cocoNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!-- 椰分 -->
                      <el-col :span="7" v-if="items.prizeType==4">
                        <el-form-item label="椰分获赠数量"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.tfNum'" :rules="rules.tfNum"
                          label-width="140px">
                          <el-input v-model="items.tfNum" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <!--  -->
                      <el-col :span="7">
                        <el-form-item label="奖励上限"
                          :prop="'invitationConfigList2.'+index+'.prizeConfigList.'+indexs+'.limit'" :rules="rules.limit"
                          label-width="140px">
                          <el-input v-model="items.limit" placeholder="请输入" :style="{width: inputWidth}">
                          </el-input>
                        </el-form-item>
                      </el-col>
                      <div class="button_box">
                        <el-button type="primary" icon="el-icon-plus" circle size="mini" @click="addPrize(item)">
                        </el-button>
                        <el-button type="danger" icon="el-icon-delete" circle size="mini"
                          @click="deletePrize(item,indexs)" v-if="item.prizeConfigList.length>1"></el-button>
                      </div>
                    </el-row>
                  </div>
                </div>
              </template>
            </template>
          </div>
          <!-- 新用户实名后可获赠奖品 -->
          <div class="detail_box">
            <el-form-item label="新用户实名后可获赠奖品" prop="" label-width='176px'>
              <el-switch v-model="form.registerConfigType" active-value="0" inactive-value="1">
              </el-switch>
            </el-form-item>
            <el-button type="primary" size="small" @click="addRegisteredPrizes" v-if="form.registerConfigType=='0'">
              新增注册奖品</el-button>
            <div class="table_box" v-if="form.registerConfigType=='0'">
              <div v-for="(items,registerIndex) in form.registerConfigList" :key="registerIndex"
                style="margin-bottom: 10px">
                <el-row type="flex" justify="start">
                  <el-col :span="6">
                    <el-form-item label="奖品类型：" :prop="'registerConfigList.' + registerIndex + '.prizeType'"
                      :rules="rules.prizeType" :label-width="labelWidth">
                      <el-select filterable v-model="items.prizeType" placeholder="请选择" clearable
                        :style="{width: inputWidth}">
                        <el-option v-for="item in prizeTypeLs" :key="item.id" :label="item.value" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <!-- 数字权益卡 -->
                  <el-col :span="6" v-if="items.prizeType==2">
                    <el-form-item label="选择数字权益卡：" :prop="'registerConfigList.' + registerIndex + '.equityCardId'"
                      :rules="rules.equityCardId" label-width="140px">
                      <el-select filterable v-model="items.equityCardId" placeholder="请选择" clearable
                        :style="{width: inputWidth}">
                        <el-option v-for="item in equityList" :key="item.id" :label="item.value" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <!-- 盲盒优惠券 -->
                  <el-col :span="8" v-if="items.prizeType==1">
                    <el-form-item label="获赠盲盒优惠券数量：" :prop="'registerConfigList.' + registerIndex + '.boxCouponNum'"
                      :rules="rules.boxCouponNum" label-width="180px">
                      <el-input v-model.number="items.boxCouponNum" placeholder="请输入" :style="{width: inputWidth}">
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <!-- 数字权益卡 -->
                  <el-col :span="7" v-if="items.prizeType==2">
                    <el-form-item label="获赠数量" :prop="'registerConfigList.' + registerIndex + '.equityCardNum'"
                      :rules="rules.equityCardNum" label-width="140px">
                      <el-input v-model.number="items.equityCardNum" placeholder="请输入" :style="{width: inputWidth}">
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <!-- CoCo -->
                  <el-col :span="7" v-if="items.prizeType==3">
                    <el-form-item label="CoCo获赠数量" :prop="'registerConfigList.' + registerIndex + '.cocoNum'"
                      :rules="rules.cocoNum" label-width="140px">
                      <el-input v-model="items.cocoNum" placeholder="请输入" :style="{width: inputWidth}">
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <!-- 椰分 -->
                  <el-col :span="7" v-if="items.prizeType==4">
                    <el-form-item label="椰分获赠数量" :prop="'registerConfigList.' + registerIndex + '.tfNum'"
                      :rules="rules.tfNum" label-width="140px">
                      <el-input v-model="items.tfNum" placeholder="请输入" :style="{width: inputWidth}">
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <div class="button_box">
                    <el-button type="danger" icon="el-icon-delete" circle size="mini"
                      @click="deleteRegisteredPrizes(registerIndex)"></el-button>
                  </div>
                </el-row>
              </div>
            </div>
          </div>
          <!-- 用户每日可使用优惠券开启盲盒次数 -->
          <div>
            <el-row :gutter="20">
              <el-col :span="6">
                <el-form-item label="用户每日可使用优惠券开启盲盒次数" prop="" label-width='240px'>
                  <el-switch v-model="form.couponsDailyOpenNumType" active-value="0" inactive-value="1">
                  </el-switch>
                </el-form-item>
              </el-col>
              <el-col :span="6" v-if="form.couponsDailyOpenNumType=='0'">
                <el-form-item label="限制次数：" prop="couponsDailyOpenNum" label-width="160px">
                  <el-input v-model.number="form.couponsDailyOpenNum" placeholder="请输入" :style="{width: inputWidth}">
                    <template slot="append">次</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 用户每次活动可使用优惠券开启盲盒次数 -->
          <div>
            <el-row :gutter="20">
              <el-col :span="6">
                <el-form-item label="用户每次活动可使用优惠券开启盲盒次数" prop="" label-width='270px'>
                  <el-switch v-model="form.couponsActivityOpenNumType" active-value="0" inactive-value="1">
                  </el-switch>
                </el-form-item>
              </el-col>
              <el-col :span="6" v-if="form.couponsActivityOpenNumType=='0'">
                <el-form-item label="限制次数：" prop="couponsActivityOpenNum" label-width="160px">
                  <el-input v-model.number="form.couponsActivityOpenNum" placeholder="请输入" :style="{width: inputWidth}">
                    <template slot="append">次</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </div>

          <!-- 新增其他规则 -->
          <div>
            <el-button type="primary" size="small" @click="handleAdd">新增其他规则</el-button>
            <div class="add_rule" v-for="(item,ruleIndex) in form.elseRulesConfigList" :key="ruleIndex">
              <template v-if="form.elseRulesConfigList.length!=0">
                <span>标题：{{item.title}}</span>
                <div>{{item.content}}</div>
                <el-button type="primary" icon="el-icon-edit" circle size="mini" @click="handleUpdate(ruleIndex)">
                </el-button>
                <el-button type="danger" icon="el-icon-delete" circle size="mini" @click="handleDelete(ruleIndex)">
                </el-button>
              </template>
            </div>
          </div>
        </el-form>
      </div>
    </div>
    <Dialog ref="dialog" @refresh="getOtherForm(arguments)"></Dialog>
  </div>
</template>

<script>
  import {
    airdropEquityLs,
    saveIncentiveRules,
    getIncentiveRules
  } from "@/api/incentiveManagement";
  import Dialog from "@/views/incentiveManagement/incentiveRules/dialog";
  export default {
    name: "",
    components: {
      Dialog
    },
    data() {
      var checkcocoNum = (rule, value, callback) => { //获赠CoCo数量校验
        let regNumber = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^\d\.\d{1,2}$)/; //大于0的数值且最多保留两位小数的数值
        if (regNumber.test(value) == false || value == '0.00' || value == '0.0') {
          return callback(new Error('请填写大于0且最多保留两位小数的数值'));
        } else {
          return callback()
        }
      };
      var checktfNum = (rule, value, callback) => { //获赠椰分数量校验
        let regNumber = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^\d\.\d{1,2}$)/; //大于0的数值且最多保留两位小数的数值
        if (regNumber.test(value) == false || value == '0.00' || value == '0.0') {
          return callback(new Error('请填写大于0且最多保留两位小数的数值'));
        } else {
          return callback()
        }
      };
      var checkLimit = (rule, value, callback) => { //奖励上限数量校验
        let regNumber = /(^[0-9](\d+)?(\.\d{1,2})?$)|(^\d\.\d{1,2}$)/; //大于等于0的数值且最多保留两位小数的数值
        if (regNumber.test(value) == false) {
          return callback(new Error('请填写大于0且最多保留两位小数的数值'));
        } else {
          return callback()
        }
      };
      return {
        labelWidth: '100px',
        inputWidth: '160px',
        disabled: false,
        loading: false,
        sumitLoading: false,
        fileType: ["png"],
        equityList: [], //权益卡下拉数组
        prizeTypeLs: [], //奖品类型下拉数组
        option: [{
          id: 1,
          value: '盲盒优惠券'
        }, {
          id: 2,
          value: '数字权益卡'
        }, ],
        optionTwo: [{
          id: 1,
          value: '奖品1'
        }, {
          id: 2,
          value: '奖品2'
        }, ],
        ruleTypeLs: [ //规则类型
          {
            id: '1',
            value: '自定义邀新规则'
          }, {
            id: '2',
            value: '循环邀新规则'
          },
        ],
        // 表单参数
        form: {
          dateTwo: [], //用户邀请新用户后可获赠奖品时间（校验用）
          inviteUrl: '', //邀新url
          ruleType: '', //规则类型 1 自定义邀新规则 2 循环邀新规则	
          invitationConfigStartDate: '', //用户邀请新用户后可获赠奖品开始时间【精确到小时】 yyyy-MM-dd HH:mm:ss
          invitationConfigEndDate: '', //用户邀请新用户后可获赠奖品结束时间【精确到小时】 yyyy-MM-dd HH:mm:ss
          couponsActivityOpenNum: '', //用户每次活动可使用优惠券开启盲盒次数
          couponsActivityOpenNumType: '0', //用户每次活动可使用优惠券开启盲盒次数 是否展开 0展开 1关闭
          couponsDailyOpenNum: '', //用户每日可使用优惠券开启盲盒次数
          couponsDailyOpenNumType: '0', //用户每日可使用优惠券开启盲盒次数 是否展开 0展开 1关闭
          invitationConfigType: '0', //用户邀请新用户后可获赠奖品 是否展开 0展开 1关闭	
          invitationConfigList: [ //用户邀请新用户后可获赠奖品 自定义邀新规则
            {
              peoples: '', //邀请人数
              prizeConfigList: [ //奖品类型数组
                {
                  boxCouponNum: '', //获赠盲盒优惠券数量
                  equityCardId: '', //选择数字权益卡
                  equityCardNum: '', //获赠数量
                  prizeType: '', //奖品类型
                  cocoNum: '', //获赠CoCo数量
                  tfNum: '', //获赠椰分数量
                }
              ],
            }
          ],
          invitationConfigList2: [ //用户邀请新用户后可获赠奖品 循环义邀新规则
            {
              peoples: '', //邀请人数
              prizeConfigList: [ //奖品类型数组
                {
                  boxCouponNum: '', //获赠盲盒优惠券数量
                  equityCardId: '', //选择数字权益卡
                  equityCardNum: '', //获赠数量
                  prizeType: '', //奖品类型
                  cocoNum: '', //获赠CoCo数量
                  tfNum: '', //获赠椰分数量
                  limit: '', //奖励上限
                }
              ],
            }
          ],
          registerConfigType: '0', //新用户注册后可获赠奖品 是否展开 0展开 1关闭
          registerConfigList: [ //新用户注册后可获赠奖品
            {
              boxCouponNum: '', //获赠盲盒优惠券数量
              equityCardId: '', //选择数字权益卡
              equityCardNum: '', //获赠数量
              prizeType: '', //奖品类型
              cocoNum: '', //获赠CoCo数量
              tfNum: '', //获赠椰分数量
            }
          ],
          elseRulesConfigList: [ //其它规则
            // {
            //   content: '', //内容
            //   img: '', //规则图标
            //   title: '', //标题
            // }
          ],
        },
        // 表单校验
        rules: {
          inviteUrl: [{
            required: true,
            message: "请上传邀新背景",
            trigger: ["blur", "change"]
          }],
          dateTwo: [{
            type: 'array',
            required: true,
            message: '请选择邀请时间',
            trigger: 'change'
          }, ],
          peoples: [{
            required: true,
            message: "请填写邀请人数",
            trigger: ["blur", "change"]
          }],
          prizeType: [{
            required: true,
            message: "请选择奖品类型",
            trigger: ["blur", "change"]
          }],
          equityCardId: [{
            required: true,
            message: "请选择数字权益卡",
            trigger: ["blur", "change"]
          }],
          boxCouponNum: [{
            required: true,
            message: "请填写获赠盲盒优惠券数量",
            trigger: ["blur", "change"]
          }],
          equityCardNum: [{
            required: true,
            message: "请填写获赠数量",
            trigger: ["blur", "change"]
          }],
          couponsActivityOpenNum: [{
            required: true,
            message: "请输入限制次数",
            trigger: ["blur", "change"]
          }],
          couponsDailyOpenNum: [{
            required: true,
            message: "请输入限制次数",
            trigger: ["blur", "change"]
          }],
          cocoNum: [{
            validator: checkcocoNum,
            trigger: ['change', 'bulr'],
          }],
          tfNum: [{
            validator: checktfNum,
            trigger: ['change', 'bulr'],
          }],
          limit: [{
            validator: checkLimit,
            trigger: ['change', 'bulr'],
          }],
          ruleType: [{
            required: true,
            message: "请选择规则类型",
            trigger: ["blur", "change"]
          }],
        },
      };
    },
    created() {
      this.getIncentiveRules()
      this.getAirdropEquityLs()
      this.getDict()
    },
    methods: {
      getImg(e) {
        this.form.inviteUrl = e
        this.$refs['imgRef'].clearValidate();
      },
      //激励规则配置
      getIncentiveRules() {
        this.loading = true;
        getIncentiveRules().then(response => {
          this.form = {
            dateTwo: [],
            inviteUrl: response.result.inviteUrl,
            invitationConfigStartDate: response.result.invitationConfigStartDate,
            invitationConfigEndDate: response.result.invitationConfigEndDate,
            couponsActivityOpenNum: response.result.couponsActivityOpenNum,
            couponsActivityOpenNumType: response.result.couponsActivityOpenNumType,
            couponsDailyOpenNum: response.result.couponsDailyOpenNum,
            couponsDailyOpenNumType: response.result.couponsDailyOpenNumType,
            invitationConfigType: response.result.invitationConfigType,
            invitationConfigList: response.result.invitationConfigList,
            invitationConfigList2: response.result.invitationConfigList2,
            registerConfigType: response.result.registerConfigType,
            registerConfigList: response.result.registerConfigList,
            elseRulesConfigList: response.result.elseRulesConfigList,
            ruleType: response.result.ruleType
          }
          // this.form = response.result
          // this.form.dateTwo = []
          if (response.result.invitationConfigStartDate != '') {
            this.form.dateTwo[0] = response.result.invitationConfigStartDate
            this.form.dateTwo[1] = response.result.invitationConfigEndDate
          }
          setTimeout(() => {
            this.loading = false
          }, 500)
        }).catch(() => {
          this.loading = false
        })
      },
      //查询奖品类型
      getDict() {
        var dictType = "incentive_rules_prize_type";
        this.$getSelectList(dictType)
          .then((res) => {
            this.prizeTypeLs = res.result[0].dictList;
          })
          .finally(() => {

          });
      },
      //查询权益卡下拉框
      getAirdropEquityLs() {
        let data = {}
        airdropEquityLs(data).then(response => {
          this.equityList = response.result
        });
      },
      /** 奖品类型选择 */
      selectChange(e) {
        this.$refs['form'].clearValidate();
      },
      addInvitationRules() {
        //新增邀请规则
        if (this.form.ruleType == '') {
          this.$message.warning('请选择规则类型');
          return
        } else if (this.form.ruleType == '2') { //循环
          var data = {
            peoples: '', //邀请人数
            prizeConfigList: [ //奖品类型数组
              {
                boxCouponNum: '', //获赠盲盒优惠券数量
                equityCardId: '', //选择数字权益卡
                equityCardNum: '', //获赠数量
                prizeType: '', //奖品类型
                limit: '', //奖励上限
              }
            ],
          }
          this.form.invitationConfigList2.push(data)
        } else { //自定义
          var data = {
            peoples: '', //邀请人数
            prizeConfigList: [ //奖品类型数组
              {
                boxCouponNum: '', //获赠盲盒优惠券数量
                equityCardId: '', //选择数字权益卡
                equityCardNum: '', //获赠数量
                prizeType: '', //奖品类型
              }
            ],
          }
          this.form.invitationConfigList.push(data)
        }
      },
      deleteInvitationRules(index) {
        //删除邀请规则
        if(this.form.ruleType=='2'){
          this.form.invitationConfigList2.splice(index, 1);
        }else{
          this.form.invitationConfigList.splice(index, 1);
        }
        
      },
      /** 新增奖品 */
      addPrize(item) {
        item.prizeConfigList.push({
          prizeType: '', //奖品类型
          boxCouponNum: '', //获赠盲盒优惠券数量
          equityCardNum: '', //获赠数量
          equityCardId: '', //选择数字权益卡
        })
      },
      /** 删除奖品 */
      deletePrize(item, index) {
        item.prizeConfigList.splice(index, 1);
      },
      /** 新增注册奖品 */
      addRegisteredPrizes() {
        this.form.registerConfigList.push({
          prizeType: '', //奖品类型
          boxCouponNum: '', //获赠盲盒优惠券数量
          equityCardNum: '', //获赠数量
          equityCardId: '', //选择数字权益卡
        })
      },
      /** 删除注册奖品 */
      deleteRegisteredPrizes(index) {
        this.form.registerConfigList.splice(index, 1);
      },
      /** 新增其他规则按钮操作 */
      handleAdd() {
        this.$refs.dialog.open(null, this.form.elseRulesConfigList);
      },
      /** 修改其他规则按钮操作 */
      handleUpdate(ruleIndex) {
        this.$refs.dialog.open(ruleIndex, this.form.elseRulesConfigList);
      },
      /** 删除其他规则按钮操作 */
      handleDelete(index) {
        this.form.elseRulesConfigList.splice(index, 1);
      },
      /** 获取其他规则信息 */
      getOtherForm(msg) {
        console.log('msg++', msg)
        let obj = msg[0]
        let index = msg[1]
        if (index == null) {
          let info = {
            title: obj.titles,
            content: obj.contents,
            img: obj.imgs
          }
          this.form.elseRulesConfigList.push(info)
        } else {
          this.form.elseRulesConfigList[index].title = obj.titles
          this.form.elseRulesConfigList[index].content = obj.contents
          this.form.elseRulesConfigList[index].img = obj.imgs
        }
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.dateTwo.length > 0) {
              this.form.invitationConfigStartDate = this.form.dateTwo[0] + ':00:00'
              this.form.invitationConfigEndDate = this.form.dateTwo[1] + ':00:00'
            }
            this.sumitLoading = true;
            saveIncentiveRules(this.form).then(response => {
              this.$message.success('保存成功');
              this.sumitLoading = false;
              this.getIncentiveRules()
            }).catch(() => {
              this.sumitLoading = false;
            });
          }
        });
      },
    }
  };

</script>
<style scoped>
  .head {
    box-shadow: 0px 4px 12px 0px rgb(1 41 99 / 6%);
    background-color: #fff;
    border-radius: 8px;
    padding: 20px 20px 0;
  }

  .listBox {
    box-shadow: 0px 4px 12px 0px rgb(1 41 99 / 6%);
    background-color: #fff;
    border-radius: 8px;
    padding: 20px 20px;
    margin-top: 10px;
  }

  .listBox_head {
    width: 100%;
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    padding-bottom: 20px;
  }

  .title {
    font-size: 24px;
    color: #222;
    margin-right: 20px;
  }

  .table_box {
    width: 1100px;
    border-radius: 8px;
    border: 1px solid #dfe6ec;
    padding: 20px;
    margin-top: 20px;
  }

  .table_box_head {
    display: flex;
    justify-content: flex-end;
    font-size: 24px;
  }

  .table_box_head span {
    color: red;
    cursor: pointer;
  }

  .detail_box {
    margin-bottom: 20px;
  }

  .button_box {
    margin-top: 4px;
    padding-left: 20px;
  }

  .add_rule {
    display: flex;
    align-items: center;
    margin-top: 20px;
    color: #222;
  }

  .add_rule span {
    margin-right: 10px;
    font-weight: bold;
  }

  .add_rule div {
    margin-right: 20px;
  }

  .flex {
    padding-top: 20px;
    display: flex;
  }

</style>
